<template>
	<view class="content">
		<view class="form">
			<view class="form-item top-item">
				<view class=""><text class="require">*</text>企业名称</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.name"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业简称</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.abbreviation"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业社会信用代码</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.credit_code"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业成立日期</view>
				<picker mode="date" @change="checkDate" :end="endDate">
					<text v-if="!companyInfo.establish_date" class="input-style">请选择</text>
					<text v-else class="form-input">{{ companyInfo.establish_date }}</text>
					<uni-icons type="arrowright" size="16" color="#999"></uni-icons>
				</picker>
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业注册资本(万元)</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.registered_capital"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业注册地址</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.registered_address"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业办公地址</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.office_address"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>企业联系电话</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.contact_number"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class="">企业备注</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.remark"
					placeholder-class="input-style" />
			</view>
		</view>
		<view class="form">
			<view class="form-item top-item">
				<view class=""><text class="require">*</text>法定代表人姓名</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.legal_representative"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>法定代表人联系电话</view>
				<input class="form-input" type="number" placeholder="请输入"
					v-model="companyInfo.legal_contact_number" placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>法定代表人邮箱</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.legal_email"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>法定代表人证件类型</view>
				<picker mode="selector" :range="typeList" range-key="name" @change="checkType">
					<text v-if="!companyInfo.legal_certificate_type" class="input-style">请选择</text>
					<text v-else>{{companyInfo.legal_certificate_type}}</text>
					<uni-icons type="arrowright" size="16" color="#999"></uni-icons>
				</picker>	
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>法定代表人证件号码</view>
				<input class="form-input" type="text" placeholder="请输入"
					v-model="companyInfo.legal_identification_number" placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class=""><text class="require">*</text>法人居住地</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.legal_address"
					placeholder-class="input-style" />
			</view>
			<view class="form-item ">
				<view class="">法人备注</view>
				<input class="form-input" type="text" placeholder="请输入" v-model="companyInfo.legal_remark"
					placeholder-class="input-style" />
			</view>
		</view>

		<view class="fixedbtn">
			<view class="btnbox">
				<view class="btn" @tap="submit">保存</view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		supplyDetail,
		supplyRegister
	} from '../../../network/main.js';
	import {
		onShow,
		onLoad,
		onNavigationBarButtonTap
	} from '@dcloudio/uni-app';
	import {
		ref,
		reactive,
		onMounted
	} from 'vue';
	onShow(() => {
		getDetail()
		let currentDate = new Date();
		let year = currentDate.getFullYear(); 
		let month = currentDate.getMonth() + 1;
		month = month<=9?'0' + month:month
		let day = currentDate.getDate();
		day = day<=9?'0' + day:day
		endDate.value = year.toString() + '-' + month.toString() + '-' + day.toString()
	})
	const endDate = ref('')
	const checkDate = (e) => {
		companyInfo.establish_date = e.detail.value
	}
	const companyInfo = reactive({
		name: '',
		abbreviation: '',
		credit_code: '',
		establish_date: '',
		registered_capital: '',
		registered_address: '',
		office_address: '',
		contact_number: '',
		remark: '',
		legal_representative: '',
		legal_contact_number: '',
		legal_email: '',
		legal_certificate_type: '',
		legal_identification_number: '',
		legal_address: '',
		legal_remark: ''
	})
	const getDetail = () => {
		supplyDetail().then(res => {
			if(res.data.data){
				Object.assign(companyInfo, res.data.data)
			}
		})
	}
	const typeList = reactive([{
		name:'居民身份证'
	},{
		name:'临时居民身份证'
	},{
		name:'军官证'
	},{
		name:'武警警官证'
	},{
		name:'护照'
	}])
	const checkType = (e) => {
		companyInfo.legal_certificate_type = typeList[e.detail.value].name
	}
	const submit = () => {
		supplyRegister(companyInfo).then(res => {
			uni.showToast({
				title: '保存成功'
			})
			setTimeout(()=>{
				uni.navigateBack({
					delta:1
				})
			},300)
		})
	}
</script>

<style lang="scss">
	.content {
		padding-bottom: 200rpx;

		.form {
			margin: 20rpx auto;

			.form-item {
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 100rpx;
				border-top: 2rpx solid #f7f7f7;
				font-size: 28rpx;
				padding: 0 40rpx;
				box-sizing: border-box;
				background-color: #fff;

				.form-input {
					width: 400rpx;
					flex: 1;
					height: 100%;
					font-size: 28rpx;
					text-align: right;
					margin-right: 10rpx;
				}
			}

			.top-item {
				border-top: none;
			}
		}

		.fixedbtn {
			width: 100%;
			border-top: 2rpx solid #f7f7f7;
			position: fixed;
			bottom: 0;
			left: 0;
			padding: 30rpx 0;
			background-color: #fff;
			z-index: 99;

			.btnbox {
				width: 100%;
				display: flex;
				justify-content: space-around;

				.btn {
					width: 400rpx;
					height: 70rpx;
					background-color: #ffc400;
					line-height: 70rpx;
					text-align: center;
					border-radius: 12rpx;
					font-size: 26rpx;
				}
			}
		}
	}
</style>